<template>
    <div class="detail">
        <ul>
            <li><h4 class="h" @click="jian()">段子详情：   {{getCount}}</h4><hr></li>
            <li class="xiangq">{{obj.text}}</li><hr>
            <li class="l">{{obj.passtime}}  <hr class="hr">@{{obj.name}}</li>
            <li><img :src="obj.top_comments_header"></li>
        </ul>
    </div>
</template>
<script>
export default {
    name:"Detail",
    data() {
        return {
            obj:{}
        }
    },
    methods: {
        jian(){
            this.$store.commit("jian");
        }
    },
    mounted() {
        var sid = this.$route.params.sid;
        this.axios.get(`https://api.apiopen.top/getSingleJoke?sid=${sid}`).then(result=>{
            console.log(result.data.result);
            this.obj=result.data.result;
        })
    },
    computed: {
        getCount(){
        return this.$store.state.count;
        }
    },
}
</script>
<style scoped>
li{
  list-style: none;
}
.detail{
    width: 600px;
    border: 1px solid red;
    margin: auto;
}
.h{
    color: aqua;
    margin-left: -293px;
}
.l{
    margin-left: -250px;
}
.hr{
    width: 200px;
}
.xiangq{
    font-size: 19px;
}
</style>